<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="../../../global/css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../../../global/css/xs-css.css" />
    <link rel="stylesheet" type="text/css" href="./frm.css" />
</head>

<body>
    <div id="main" class="box">
        <img src="../../../global/image/vip/vip_bg.png">
        <div class="join-box">
            <div id="desc" class="title">立即加入</div>
            <div class="item-box flex">
                <div id="item-0" class="item flex-1 aui-hide"></div>
                <div id="item-1" class="item flex-1 aui-hide"></div>
            </div>
            <div class="flex">
                <div id="item-2" class="item flex-1 aui-hide"></div>
                <div id="item-3" class="item flex-1 aui-hide"></div>
            </div>

            <div class="agree-box activeBtn flex">
                <div class="ag-text">开通会员即表示您同意如下协议：</div>
                <div id="protocol" class="color-blue" data-url="" tapmode onclick="viewProtocol(this);">《阅同城会员协议》</div>
            </div>
        </div>

        <div class="btn" tapmode onclick="onPay(this);">
            <div class="btn-sign aui-hide"></div>
            <div class="btn-text"><span id="price"></span>&nbsp;立即开通</div>
        </div>
    </div>
</body>

<script id="tpl-item-panel" type="text/x-dot-template">
    <div class="item-panel" data-prodId="{{=it.productId}}" data-goodsId="{{=it.goodsId}}" data-price="{{=it.price}}" data-fmtprice="{{=it.formattedPrice}}" tapmode onclick="onSelected(this);">
        <div class="top-sign"><span>{{=it.label}}</span></div>
        <div class="vip-lev">{{=it.title}}</div>
        <div class="vip-money flex">
            <div class="money">{{=it.formattedPrice}}</div>
            {{? it.orgPrice }}
            <del class="del">{{=it.orgPrice}}</del>
            {{?}}
        </div>
    </div>
</script>

<script type="text/javascript" src="../../../config.js"></script>
<script type="text/javascript" src="../../../global/script/lib/api.js"></script>
<script type="text/javascript" src="../../../global/script/lib/doT.min.js"></script>
<script type="text/javascript" src="../../../global/script/libx/myiap.js"></script>
<script type="text/javascript" src="../../../global/script/mylib.js"></script>
<script type="text/javascript" src="../../../app.js"></script>
<script type="text/javascript" src="./frm.js"></script>

</html>


<script type="text/javascript" src="../../../global/script/_fakeapi.js"></script>
<script type="text/javascript">
	
	window.mockOurData = {
	    productIds: [
	        "vip_membership_yearly",
	        "vip_membership_seasonly",
	        "vip_membership_monthly",
	    ],
	    products: {
	        vip_membership_yearly: {
	            label: "【限时】7.3折优惠",
	            goodsId: 1,
	            orgPrice: "120",
	        },
	        vip_membership_seasonly: {
	            label: "【限时】8折优惠",
	            goodsId: 2,
	            orgPrice: "30",
	        },
	        vip_membership_monthly: {
	            label: "月度VIP会员",
	            goodsId: 3,
	        },
	    },
	    freely: {
	        productId: "vip_membership_freely",
	        title: "月度VIP会员体验包",
	        price: 0,
	        formattedPrice: "￥0元",
	        label: "限时0元",
	        goodsId: 5,
	        orgPrice: "10",
	    },
	};

	window.mockIAP = {
	    "products": [
	        {
	            "formattedPrice":"￥200.00",
	            "downloadable":false,
	            "title":"年度VIP会员",
	            "price":200,
	            "description":"享受会员特权一年",
	            "productId":"vip_membership_yearly"
	        },
	        {
	            "formattedPrice":"￥30.00",
	            "downloadable":false,
	            "title":"季度VIP会员",
	            "price":30,
	            "description":"会员特权三个月",
	            "productId":"vip_membership_seasonly"
	        },
	        {
	            "formattedPrice":"￥12.00",
	            "downloadable":false,
	            "title":"月度VIP会员",
	            "price":12,
	            "description":"会员特权一个月",
	            "productId":"vip_membership_monthly"
	        },
	        {
	            "formattedPrice":"￥0.00",
	            "downloadable":false,
	            "title":"月度VIP会员",
	            "price":0,
	            "description":"限时免费",
	            "productId":"vip_membership_freely"
	        },
	    ]
	}


	var prods = rebuildProducts(window.mockOurData, window.mockIAP.products)

	$api.data($api.byId('protocol'), 'url', 'http://www.baidu.com');
	$api.byId('desc').innerHTML = "阅同城VIP会员将于 2019-09-11 过期";
	iapDoRender(prods);
</script>
